<template>
  <div class="dashboard-editor-container" style="padding:16px;">

    <el-row :gutter="12" style="padding:6px 6px 0 0;margin-bottom:16px;">
      <!-- 代办事项-->
      <el-col :span="18" :xs="24">
        <el-card class="box-card" >
          <div slot="header" class="clearfix">
            <span style="color: #116fcf;font-weight :600;" class = "el-icon-price-tag"> 待办事项</span>


            <a><el-tag type="info" class = "tag-style" size="mini">  <router-link to="/msg/list">更多</router-link></el-tag></a>
          </div>
          <div style="height: 300px;">

            <el-table :data="innerList"   :show-header="false">

              <el-table-column type="index" label="序号" width="55" :index="indexMethod" align="center" >

                <template slot-scope="scope">
                  <i v-if="scope.row.readStatus === '已读'"  :style="{color:'#67bbff'}"  class="el-icon-document-checked size-icon" />
                  <i :style="{color:'red'}" v-else class="el-icon-document-remove size-icon" />
                </template>

              </el-table-column>
              <el-table-column label="消息标题" align="center" prop="msgTitle" width="200" >
                <template slot-scope="scope">
                  <div @click="getListb(scope.row)"  style="cursor: pointer;">
                    {{scope.row.msgTitle}}
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="发送者用户姓名" align="center" prop="sendUserName" />




              <el-table-column label="发送时间" align="center" prop="sendDate" width="180">
                <template slot-scope="scope">
                  <span>{{ parseTime(scope.row.sendDate, '{y}-{m}-{d}') }}</span>
                </template>
              </el-table-column>
              <el-table-column label="阅读状态" align="center" prop="readStatus" >

                <template slot-scope="scope">
                  <el-tag :type="scope.row.readStatus === '未读' ? 'danger' : ''"
                  >{{scope.row.readStatus}}</el-tag>
                </template>


              </el-table-column>

              <div slot="empty" style="text-align: left;">

                <el-empty    description="暂时没有待办事项" />
              </div>

            </el-table>




          </div>
        </el-card>
      </el-col>


      <el-col :span="6" :xs="24">
        <el-card class="box-card" >
          <div slot="header" class="clearfix">
            <span style="color: #116fcf;font-weight :600;" class = "el-icon-s-custom"> 个人信息</span>
          </div>
          <div style="height: 300px;">
            <div class="text-center">
              <img :src="avatar" class="user-avatar">
            </div>
            <ul class="list-group list-group-striped">
              <li class="list-group-item">
                <svg-icon icon-class="user" /> 用户名称
                <div class="pull-right">{{ user.nickName }}</div>
              </li>
              <li class="list-group-item">
                <svg-icon icon-class="phone" /> 手机号码
                <div class="pull-right">{{ user.phonenumber }}</div>
              </li>

              <li class="list-group-item">
                <svg-icon icon-class="tree" /> 部门
                <div class="pull-right" v-if="user.dept">{{ user.dept.deptName }} <!--/ {{ postGroup }}--></div>
              </li>
            </ul>
          </div>
        </el-card>
      </el-col>
    </el-row>

    <!--  通知公告  -->
    <el-row :gutter="12" style="padding:6px 6px 0 0;margin-bottom:16px;">


      <el-col :span="6" :xs="24" >
        <el-card class="box-card" style = "height: 395px">
          <div slot="header" class="clearfix">
              <span style="color: #116fcf;font-weight :600;" class = "el-icon-s-opportunity"> 通知公告</span>


<!--            <el-button-group>

              <el-button class="barChartBtn" :class="{selectBtn:currSelect===1}"  @click = "getList"  >通知公告</el-button>


            </el-button-group>-->

<!--            <span style="color: #116fcf;font-weight :600;"  class="el-icon-s-order"> 局公告</span>-->
            <a><el-tag type="info" class = "tag-style" size="mini"><router-link to="/notice/noticelist">更多</router-link></el-tag></a>

          </div>
          <el-table
            :data="noticeList"
            :show-header="false"
            style="width: 100%;height: 330px;margin-top: -5px"
            @row-click = "handle"
            :cell-style="cellStyle"
          >

            <el-table-column

              width="45" >
              <template slot-scope="scope">
                <span class = "number_top_circle" v-if = "(scope.$index+1)%2==0">  {{scope.$index+1}}</span>
                <span class = "number_top_circle_odd" v-if = "(scope.$index+1)%2==1">  {{scope.$index+1}}</span>
              </template>
            </el-table-column>

            <el-table-column
              label="公告标题"
              align="center"
              prop="noticeTitle"
              :show-overflow-tooltip="true"

            />

            <el-table-column label="创建时间" align="center" prop="createTime" width="100">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
              </template>
            </el-table-column>

          </el-table>

        </el-card>
      </el-col>

      <el-col :span="12" :xs="24">

        <el-card class="box-card" style="height: 395px" >

          <el-tabs v-model="activeName"   >

         <el-tab-pane label="常用应用" name="first"  >
              <el-scrollbar style = "height:38%">
                  <el-col :span="24" style="padding-bottom:0;">
                    <el-row class="top-list">
                        <el-col class="top-list-col" v-for="(item,index) in normalList" :xs="24" :sm="12" :md="6">
                          <el-card>
                            <a @click="getNormalList(item)" :span="24">
                              <el-image class="top-list-image" :src="imgLoad(item.appIcon)"></el-image>
                                <span v-if="item.menuName.length<5" style="padding-left: 15px;margin: 0;font-size: 15px;display: inline-block;">
                                  {{item.menuName[0]}}{{item.menuName[1]}}{{item.menuName[2]}}{{item.menuName[3]}}
                                </span>
                                <span  v-if="item.menuName.length>4" style="padding-left: 15px;margin: 0;font-size: 15px;display: inline-block;vertical-align: middle;">
                                  {{item.menuName[0]}}{{item.menuName[1]}}{{item.menuName[2]}}{{item.menuName[3]}}<br>
                                  {{item.menuName[4]}}{{item.menuName[5]}}{{item.menuName[6]}}{{item.menuName[7]}}
                                </span>
                            </a>
                          </el-card>
                        </el-col>
                    </el-row>

                  </el-col>

              </el-scrollbar>

            </el-tab-pane>

           <el-tab-pane
              v-for="item in contentList"
              row-key="menuId"
              :label="item.menuName"
              :name="''+item.menuId"
              @tab-click="handleClick(item)"
              :gutter="16"

            >

              <el-scrollbar style = "height:38%">
                <el-col :span="24" style="padding-bottom:0;">
                  <el-row class="top-list">
                    <el-col class="top-list-col" v-for="(item,index) in List" :xs="24" :sm="12" :md="6">
                      <el-card>
                        <a @click="getLista(item)" :span="24">
                          <el-image class="top-list-image" :src="imgLoad(item.appIcon)"></el-image>
                          <span v-if="item.menuName.length<5" style="padding-left: 15px;margin: 0;font-size: 15px;display: inline-block;">
                                  {{item.menuName[0]}}{{item.menuName[1]}}{{item.menuName[2]}}{{item.menuName[3]}}
                                </span>
                          <span  v-if="item.menuName.length>4" style="padding-left: 15px;margin: 0;font-size: 15px;display: inline-block;vertical-align: middle;">
                                  {{item.menuName[0]}}{{item.menuName[1]}}{{item.menuName[2]}}{{item.menuName[3]}}<br>
                                  {{item.menuName[4]}}{{item.menuName[5]}}{{item.menuName[6]}}{{item.menuName[7]}}
                                </span>
                        </a>
                      </el-card>
                    </el-col>
                  </el-row>

                </el-col>
<!--                <div class="grid-content" >
                  <div>
                    <el-button v-for="(item,index) in List" @click="getLista(item)" style="padding-left:10px;margin-left: 20px; margin-top:10px; text-align: center;"  >

                      <el-row :gutter="20" style="margin-top: -12px;margin-bottom: 30px; top: 20px;">
                        <el-col :span="8" :xs="12">


                          <el-image
                            style="width: 48px; height: 48px ; border-radius: 4px;margin-top: 7px;"
                            :src="imgLoad(item.appIcon)">


                          </el-image>

                        </el-col>
                        <el-col :span="16" :xs="12">

                          <h3 style="margin: 10px 2px;padding-right: 15px; text-align: center;">{{item.menuName[0]}}{{item.menuName[1]}}{{item.menuName[2]}}{{item.menuName[3]}}<br></h3>

                          <h3 style="margin: 5px 2px;padding-right: 15px;" >{{item.menuName[4]}}{{item.menuName[5]}}{{item.menuName[6]}}{{item.menuName[7]}}<br></h3>



                        </el-col>

                      </el-row>


                    </el-button>

                  </div>
                </div>-->
              </el-scrollbar>
            </el-tab-pane>

          </el-tabs>


          <div class="loginOut">

            <div>
              <a><el-tag type="info" class = "tag-style" size="mini"><router-link to="/application/list">更多</router-link></el-tag></a>

            </div>
          </div>




        </el-card>
      </el-col>

      <!-- 消息详情 -->
      <el-dialog :title="xiaoxi.title" :visible.sync="xiaoxi.open" :showClose="false" width="1300px" append-to-body>
        <el-form ref="form" :model="innerList" :rules="rules" label-width="150px">
          <el-container>
            <el-main>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="消息标题" prop="msgTitle">
                    <el-input v-model="innerList.msgTitle" readonly="true"/>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="发送时间" prop="sendDate">
                    <el-date-picker clearable
                                    v-model="innerList.sendDate"
                                    type="date"
                                    value-format="yyyy-MM-dd"
                                    placeholder="请选择发送时间"
                                    readonly="true">
                    </el-date-picker>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-col :span="20">
                <el-form-item label="消息内容">
                  <editor v-model="innerList.msgContent" :min-height="192" readOnly="true"/>
                </el-form-item>
              </el-col>

            </el-main>
          </el-container>
        </el-form>
        <div slot="footer" >
          <el-button style="display: inline-block;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    background: #FFFFFF;
    border: 1px solid #DCDFE6;
    border-color: #DCDFE6;
    color: #606266;
    -webkit-appearance: none;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    outline: none;
    margin: 0;
    -webkit-transition: 0.1s;
    transition: 0.1s;
    font-weight: 400;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    padding: 10px 20px;
    font-size: 14px;
    border-radius: 4px;"><router-link :to="innerList.note2"  >前 往</router-link></el-button>

          &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
          <el-button style="display: inline-block;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    background: #FFFFFF;
    border: 1px solid #DCDFE6;
    border-color: #DCDFE6;
    color: #606266;
    -webkit-appearance: none;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    outline: none;
    margin: 0;
    -webkit-transition: 0.1s;
    transition: 0.1s;
    font-weight: 400;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    padding: 10px 20px;
    font-size: 14px;
    border-radius: 4px;" @click="detailCancel">返 回</el-button>

        </div>

      </el-dialog>


      <el-col :span="6" :xs="24" >
        <el-card class="box-card1" style = "height:395px">
          <div slot="header" class="clearfix">
            <span style="color: #116fcf;font-weight :600;" class = "el-icon-date"> 近期日程</span>
            <a> <span style="color: #116fcf;font-weight :600;font-size: 10px;float: right;" class = "el-icon-d-arrow-right"><router-link to="/calendar/index">新建日程</router-link> </span></a>
          </div>
          <el-row :gutter="20">

            <el-empty   v-if = "todayCalendar.length==0" description="暂无日程" />
            <div  v-for="item in todayCalendar.slice(0,5)"  >
<!--              <el-alert

                :title="item.endTime"
                type="success"
                :closable="false"
                :description="'日程名称:'+item.scheduleTitle"
                style="margin-top: 10px">
              </el-alert>-->
            </div>

          </el-row>

        </el-card>
      </el-col>



    </el-row>
  </div>
</template>

<script>
// import datePanel from "@/components/DatePanel/DatePanel";
import {getUserProfile} from "@/api/system/user";

import userAvatar from "@/views/system/user/profile/userAvatar";
import userInfo from "@/views/system/user/profile/userInfo";
import resetPwd from "@/views/system/user/profile/resetPwd";
import { listNotice, getNotice} from "@/api/system/notice";
import {delMenu, getMenu, listMenu, listMenu1, getRouter, listNormal} from "@/api/library/application/application";
import {getNumber} from "@/api/library/application/application";
import {mapGetters, mapState} from "vuex";
import watermark from "watermark-dom";
import {updateUserProfile} from "@/api/system/user";
import log from "@/views/monitor/job/log";
import { listInner, getInner, delInner, addInner, updateInner } from "@/api/library/msg/inner";
//import Cookies from 'js-cookie'

export default {
  name: "Profile",
  components: { userAvatar, userInfo, resetPwd },
  props: {
    user: {
      type: Object,

    }
  },


  data() {

    return {
      visible: false,
      date:new Date(),
      roleGroup: {},
      froma:{},
      postGroup: {},
      activeTab: "userinfo",
      activeName: 'first',
      cover:"",
      //switch开关初始值
      value:"1",
      //通知公告标题
      titleNotice:"",
      //部门id
      deptId:"",
      //主页链表显示
      categoryList: "",
      activeName1: 'first',
      activeName2:"first",
      menuList: [],
      List:[],
      menuOptions: [],
      List1:[],
      title: "",
      product: "", // 分类列表
      normalList:[],
      contentList: [],
      xiaoxi:{
        // 是否显示弹出层（用户查询）
        open: false,
        // 弹出层标题（用户查询）
        title: "",
      },
      currSelect:1,
      open: false,
      innerList:[],
      rules: {

      },


      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 7,
        noticeType:undefined,
        noticeTitle: undefined,
        createBy: undefined,
        status: 0,
        orderByColumn:"createTime",
        isAsc:"desc"

      },
      calendarParams:{
        orderByColumn:"endTime",
        isAsc:"desc"
      },
      messageParams:{
        pageNum: 1,
        pageSize: 6,
        orderByColumn:"createTime",
        isAsc:"desc"
      },

      // 公告表格数据
      noticeList: [],
      // 日程列表
      todayCalendar:[],

      imgwrap:[

        /*   {
             id: "1",
             url: require("../assets/images/news1.jpg"),
             title:"学兵毕业季，一起重温难忘瞬间！"
           },
           {
             id: "2",
             url: require("../assets/images/news2.jpg"),
             title:"学兵毕业季，一起重温难忘瞬间！"
           },
           {
             id: "3",
             url: require("../assets/images/news3.jpg"),
             title:"西部战区空军雷达某旅首届军事体育运动会见闻"
           }*/

      ]
    };

  },
  //去水印
  mounted() {
    // 加载水印
    const username = this.$store.state.user.name;
    watermark.load({ watermark_txt: "  "   });
  },
  //获取头像
  computed: {
    ...mapGetters([

      'avatar',

    ]),

    topNav: {
      get() {
        return this.$store.state.settings.topNav
      }
    },

  },
  created() {

    this.getList();
    this.getUser();
    this.getList1();
    this.getNormal();
    //this.getCalendar();
    this.getMessage();
    /* this.getDate();*/
    /* websockt */
    /*this.wsIsRun = true
    this.wsInit()*/

    /* this.getCulture()*/


    /* 后加的获取外部公告 9/4*/



  },
  watch:{

    activeName:function(val) { //监听切换状态-计划单

      if (val=='first'|| val==null){
        this.List = undefined;
        this.loading = true;
        listNormal().then(response => {
          this.normalList = response.data;
          this.loading = false;
          // console.log(this.normalList+"233");
        });
      }
      else {
        getRouter(val).then(response => {
          this.List1 = response.data;
          window.a=this.List1.path;
          this.loading = false;
          // console.log(this.List1.path+"710")
        });
        getMenu(val).then(response => {
          this.List = response.data;
          this.loading = false;
          // console.log(this.List[0].path+"777")

        })};


      // this.$router.push({path: "/hetong/cjlproject",query: {id: "1", name: "admin"} });


      // 更新地址栏链接，方便刷新页面可以回到原来的页面

    },
    //动态监听swith开关
    /* value:{

       handler(val) {

         if(val=='1'||val == null){


           getUserProfile().then(response => {
             this.user = response.data;
             this.deptId = response.data.deptId;
             this.loading = true;
             if(this.deptId == '101'){

               this.titleNotice = "通知公告"

             }else{
               this.titleNotice = "通知公告(内部公告)"
               this.queryParams.noticeType = val
             }

             listNotice(this.queryParams).then(response => {
               this.noticeList = response.rows;
               this.total = response.total;
               this.loading = false;
             });


           });


         }else {
           this.titleNotice = "通知公告(外部公告)"
           this.queryParams.noticeType = val
           listNotice(this.queryParams).then(response => {
             this.noticeList = response.rows;
             this.total = response.total;
             this.loading = false;
           });
         }

       },
       immediate: true
     },*/
  },

  methods: {


    imgLoad(img){
      try {

        return  require(`../assets/button/`+img)

      } catch (error) {
        return  require(`../assets/button/aaaa.png`)
      }
    },

    close() {
      this.$tab.closePage();
    },


    //应用展示更多
    toURL(){
      this.$router.push({path: "/system/application"});
    },
    //文化宣传详情
    tourlCulture(){
      this.$router.push({path: "/system/application"});
    },

    tableRowClassName({row, rowIndex}) {
      if (rowIndex === 1) {
        return 'warning-row';
      } else if (rowIndex === 3) {
        return 'success-row';
      }
      return '';
    },
    //获取日程
   /* getCalendar(){

      listCalendar(this.calendarParams).then(response => {
        this.loading = true;
        this.todayCalendar  = response.rows;

      })


    },*/

    // 取消按钮
    detailCancel() {
      this.xiaoxi.open = false;
      //   this.getList();
    },

    //文化宣传详情
    culDetail(val){
      console.log(val)
      this.$router.push({
        path: '/dangzheng/culturexiangqing',
        query:{
          id: val,
        }
      })
    },



    //点击公告触发的事件
    handle(row, event, column) {
      // console.log(row)
      this.$router.push({
        path: '/notice/index',
        query:{
          noticeId: row.noticeId,
        }
      })
    },
    //公告显示小手
    cellStyle(data) {

      return "cursor:pointer;text-align:left;"
    },
    indexMethod(index) {
      return index +1;
    },

    handleClick(tab, event) {
      console.log(tab, event);
    },
    /** 查询公告列表 */
    getList() {

      getUserProfile().then(response => {
        this.user = response.data;
        this.deptId = response.data.deptId;
        this.loading = true;

          listNotice(this.queryParams).then(response => {
            this.noticeList = response.rows;
            this.total = response.total;
            this.loading = false;
          });

      })

    },
    getList1() {
      this.loading = true;
      listMenu().then(response => {
        this.contentList = response.data;
        this.loading = false;
      });
    },

    getNormal(){
      this.loading = true;
      listNormal().then(response => {
        this.normalList = response.data;
        this.loading = false;
      });
    },
    getNormalList(item){
      const path =item.path;
      const menuId = item.menuId;
      getNumber(menuId).then(response => {
      });
      this.$router.push({path: "/"+path});
    },
    getLista(item) {
      const path =item.path;
      // console.log(path+"88");
      // const tableName = row.tableName || this.tableNames[0];
      // const params = {pageNum: this.queryParams.pageNum};
      const menuId = item.menuId;
      getNumber(menuId).then(response => {
      });
      this.$router.push({path: "/"+a+"/"+path});
    },


    getUser() {
      getUserProfile().then(response => {
        this.user = response.data;
        this.roleGroup = response.roleGroup;
        this.postGroup = response.postGroup;
        this.deptId = response.data.deptId;

      });
    },

    /** 查询内部消息列表 */
    getMessage() {
      this.loading = true;
      listInner(this.messageParams).then(response => {
        this.innerList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },




    /** 查询文化宣传列表 */
    /*    getCulture() {
          this.loading = true;

          listContent().then(response => {

            let data = response.rows;
            this.total = response.total;
            //重新构造json数组
            for (let i = 0; i < data.length; i++) {

              /!*  var urlPhoto = data[i].note2.replace('/profile','D:/workspaces/ZHXXZH/yinhe-common/src/main/java/com/yinhe/common/file')
                console.log(urlPhoto)*!/
              //如果是在主页上显示 1是展示
              if(data[i].note3=="1"){

                //截取图片名称
                var photo = data[i].note5.split('/')[3]

                //截取路径
                /!*    var url = data[i].note2.replace(photo,'')
                   var realUrl = url.replace('/profile','D:/workspaces/ZHXXZH/yinhe-common/src/main/java/com/yinhe/common/file')
                   console.log(realUrl)*!/

                this.imgwrap.push({
                  id:data[i].id,
                  index:data[i].note4,
                  title:data[i].noticeTitle,
                  url: require('D:/ZHXXZH/yinhe-common/src/main/java/com/yinhe/common/file/upload/'+photo)
                  /!*  url: require(urlPhoto),*!/

                })
              }



            }
          });
        },*/

    /* websockt */
    // 给后台发送消息
    /*sendDataToServer() {
      if (this.webSocket.readyState === 1) {
        this.webSocket.send('来自前端的数据')
      } else {
        throw Error('服务未连接')
      }
    },
    /!**
     * 初始化ws
     *!/
    wsInit() {
      /!* console.log("userName: " + this.name)*!/
      const wsuri = 'ws://127.0.0.1:9900/zhxxzhadmin/wsService/' + this.name
      this.ws = wsuri
      if (!this.wsIsRun) return
      // 销毁ws
      this.wsDestroy()
      // 初始化ws
      this.webSocket = new WebSocket(this.ws)
      // ws连接建立时触发
      this.webSocket.addEventListener('open', this.wsOpenHanler)
      // ws服务端给客户端推送消息
      this.webSocket.addEventListener('message', this.wsMessageHanler)
      // ws通信发生错误时触发
      this.webSocket.addEventListener('error', this.wsErrorHanler)
      // ws关闭时触发
      this.webSocket.addEventListener('close', this.wsCloseHanler)

      // 检查ws连接状态,readyState值为0表示尚未连接，1表示建立连接，2正在关闭连接，3已经关闭或无法打开
      clearInterval(this.wsTimer)
      this.wsTimer = setInterval(() => {
        if (this.webSocket.readyState === 1) {
          clearInterval(this.wsTimer)
        } else {
          console.log('ws建立连接失败')
          this.wsInit()
        }
      }, 3000)
    },
    wsOpenHanler(event) {
      console.log('ws建立连接成功')


    },
    wsMessageHanler(e) {
      console.log('wsMessageHanler')
      console.log(e)
      Cookies.set('unreadNums', '6')
      this.unreadMsgNums = '8'
      this.open1(e)
      //const redata = JSON.parse(e.data)
      //console.log(redata)

    },
    /!**
     * ws通信发生错误
     *!/
    wsErrorHanler(event) {
      console.log(event, '通信发生错误')
      this.wsInit()
    },
    /!**
     * ws关闭
     *!/
    wsCloseHanler(event) {
      console.log(event, 'ws关闭')
      this.wsInit()
    },
    /!**
     * 销毁ws
     *!/
    wsDestroy() {
      if (this.webSocket !== null) {
        this.webSocket.removeEventListener('open', this.wsOpenHanler)
        this.webSocket.removeEventListener('message', this.wsMessageHanler)
        this.webSocket.removeEventListener('error', this.wsErrorHanler)
        this.webSocket.removeEventListener('close', this.wsCloseHanler)
        this.webSocket.close()
        this.webSocket = null
        clearInterval(this.wsTimer)
      }
    },
    /!**
     * 弹窗
     *!/
    open1(e) {
      const h = this.$createElement;
      if(e.data){
        console.log(e.data)
        var data = JSON.parse(e.data)
        /!*if(data){
          //自己展示弹框的封装方法

        }*!/
        /!*this.$notify({
          title: '系统通知提醒',
          message: h('i', { style: 'color: teal'}, e.data)
        });*!/
        /!*this.$notify({
          title: data.msgTitle,
          message: h('i', { style: 'color: teal'}, data.msgContent)
        });*!/
        var route = this.$router;
        var msgType = data.msgType;
        if (msgType=="push") {
          this.$notify.info({
            title: data.msgTitle,
            message: data.msgContent,
            onClick() {
              console.log(route)
              route.push({path: "/msg/list"});
            }
          });
        } else if (msgType == "unread") {
          Cookies.set('unreadNums', data.unreadNums);
          this.$notify.info({
            title: "消息提醒",
            //message: data.msgContent,
            message: "您当前有" + data.unreadNums + "条未读消息，点击此处查看",
            onClick() {
              console.log(route)
              route.push({path: "/msg/list"});
            }
          });
        }

      }
    }*/

    /** 详情操作 */
    getListb(row) {
      const id = row.id || this.ids
      getInner(id).then(response => {
        this.innerList = response.data;
        this.xiaoxi.open = true;
        this.xiaoxi.title = "消息详细";
      });


    }


  },

};
</script>

<style lang="scss" scoped>




.dashboard-editor-container {

  padding: 32px;
  background-color: rgb(240, 242, 245);
  position: relative;

  .chart-wrapper {
    background: #fff;
    padding: 16px 16px 0;
    margin-bottom: 32px;
    padding-left: 30px;
  }

  .el-tabs .el-tabs__content {
    max-height: 100px;
    overflow: auto;
  }

}

@media (max-width:1024px) {
  .chart-wrapper {
    padding: 8px;
  }
}

/* 固定 应用board 宽度; */
.el-tabs--card {
  height: calc(32vh);
  /* overflow-y: auto; */
}

.el-tab-pane {
  height: calc(32vh);
  overflow-y: auto;
  overflow-x: hidden;
}
.tag-style{
  height: 19px;
  color: #116fcf;
  font-family: 黑体;
  font-size: 13px;
  float: right;
  margin-right: 20px;
  line-height:15px;

}
.tag-menu-style{
  height: 19px;
  color: #116fcf;
  font-family: 黑体;
  font-size: 13px;
  float: right;
  margin-right: 0px;
  line-height:15px;
  margin-top: 5px;

}

.bannerimg{
  width: 100%;
  height: inherit;
}
/* 文字样式*/
.carousel-p {
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 25px;
  line-height: 35px;
  text-align: center;
  padding-left: -28px;
  color: white;
  bottom: 66px;
  position: relative;
}
.el-icon-d-arrow-right{
  float: right;
  margin-right: 20px;
  padding-top: 5px;
  font-size:10px !important;
}

.is-selected {
  color: #1989FA;
}


/*日历自定义样式*/
::v-deep .el-calendar__header {
  // 修改头部背景颜色
  background-color: #FFFFFF;
  padding: 3px 5px;
  border: none;
  display: flex;
  justify-content: center;
  margin-top: 35px;

  .el-calendar__button-group {
    // 隐藏原生按钮
    display: none;
  }


  .el-calendar__title {
    // 修改头部标题的字体颜色
    color: #495060 !important;
    font-size: 20px;
    font-weight: bolder;
  }
}

::v-deep .el-calendar__body {
  // 修改主题部分
  padding: 0;
}

::v-deep .el-calendar-table {
  thead {
    th {
      // 修改头部星期部分
      padding: 5px;
      background-color: #2f81d5;
      color: white;
    }
  }

  .is-selected {
    .el-calendar-day {
      p {
        // 选中日期颜色
        color: black;
      }
    }
  }

  .el-calendar-day {
    // 每天小块样式设置
    padding: 0;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;

    p {
      // 所有日期颜色
      color: black;
      z-index: 1;
      user-select: none;
      display: flex;
    }
  }
}

::v-deep .el-calendar-table__row {
  .prev, .next {
    // 修改非本月
    .el-calendar-day {
      p {
        color: #f0d9d5;
      }
    }
  }

  td {
    // 修改每一个日期td标签
    &:first-child, &:last-child {
      background-color: #f5f5f5;
    }
  }
}

button {
  padding: 3px 10px;
}

//隐藏el-tab-pane滚动条
::v-deep .el-tab-pane {
  height: calc(100vh - 110px);
  overflow-y: hidden;
}


::v-deep .el-scrollbar__wrap {
  overflow-x: hidden!important;


}

::v-deep .-webkit-scrollbar {
  /*隐藏滚轮*/
  display: none;
}
::v-deep.el-table .warning-row {
  background: oldlace;
}

::v-deep.el-table .success-row {
  background: #f0d9d5;
}
.pos1{

  position:absolute;             // 绝对定位,同时规定left和top
  left: 0;
  top:0;
}


//swiitch开关的样式
::v-deep .el-switch__core{
  width:30px!important;
  height:15px;

}
//111
::v-deep .el-tabs__nav-wrap.is-scrollable {
   margin-right: 40px;
   padding: 0 20px;
   -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

::v-deep .el-switch__core::after{
  width:14px;
  height:14px;
  margin-top:-1px;
  margin-bottom: -4px;
}
::v-deep.el-switch.is-checked .el-switch__core::after {
  left: 100%;
  margin-left: -14px;
}

//更改table表中文字的颜色
::v-deep.el-table{
  color: #000000;
}

//日程文字颜色
::v-deep.el-alert--success.is-light {
  background-color: #e7faf0;
  color: #000000;
}
::v-deep.el-alert--success.is-light .el-alert__description {
  color: #507761;
}


/*数字加圈*/
.number_top_circle {
  display: table-cell;
  border-radius: 18px;
  background-color: #4b9dfc;
  width: 25px;
  height: 25px;
  text-align: center;
  vertical-align: middle;
  color: #fff;
}
.number_top_circle_odd {
  display: table-cell;
  border-radius: 18px;
  background-color: #4b9dfc;
  width: 25px;
  height: 25px;
  text-align: center;
  vertical-align: middle;
  color: #fff;
}

//个人中心头像样式
.user-avatar{
  border-radius: 50%;
  height:165px;
  border: 1px solid #409eff;

}
//去掉table表下面的边框线
.el-table__row>td {
  border: none;
}

.el-table::before {
  height: 0px;
}

//纵向分割线
::v-deep.el-divider--vertical{

  height: 10em;
}

.selectBtn{
  background-color: #1482f0;
  color: #ffffff;
}

</style>
<!-- 日历table表的样式-->
<style>




.el-image__error {
  font-size: 10px;

}






.size-icon{
  font-size: 25px;
}

.createInfo th, .createInfo tr {
  background-color: #409eff !important;
  color: #FFFFFF;
  text-align: center;

}
.createInfo tbody tr:hover>td {
  background-color: #409eff !important;
}

/*日期组件绝对定位*/
.main{
  position: relative;

}
.target{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,0%);
}


/*menu中更多按钮*/
.loginOut{
  /* position: absolute;right:23%;top:25px;*/
  position: absolute;right:26%;top:33px;
  color: #e6a23c;
  /*  font-weight: 600;
    font-size: 14px;*/
}
.grid-content{

  padding-left: 0%;
  padding-right: 0%;

}


/* 顶部列表 */
.top-list-image{
  margin-right: 12px;
  font-size: 24px;
  width: 40px;
  padding-top: 0px;
  height: 40px;
  vertical-align: middle;
  text-align: center;
  border-radius:16px;
  color: #fff;
}

.top-list-col{
  height: 100px;
  padding: 10px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  border-radius: 4px;
}

.top-list-span{
  max-width: 4em;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis; /*超出部分用...代替*/
}

</style>
